<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
        content="width=device-width,initial-scale=1.0,viewport-fit=cover,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>尤迈桃李会</title>
    <script src="js/rem.js"></script>
    <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
    <link rel="stylesheet" href="css/weui.min.css">
    <link rel="stylesheet" href="css/jquery-weui.min.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/ot-nowStudy.css">
    <script>(function () { var _53code = document.createElement("script"); _53code.src = "https://tb.53kf.com/code/code/96d8f960b261e49515450f8953b044bc5/1"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(_53code, s); })();</script>
</head>

<body>
    <div class="pub_bar" title="我的课程" left="back"></div>
    <!--  -->
    <div class="pub-container has-tabbar  bgwhite" id="main">
        <div class="hxl_tabs space-border">
            <div class="tabs_item active"><a href="?init=0">学习列表</a></div>
            <div class="tabs_item"><a href="?init=1">浏览记录</a></div>
            <div class="tabs_item"><a href="?init=2">课程订单</a></div>
        </div>
        <!-- 列表 -->
        <div class="relevant_listing">
            <div class="relevant_list" style="display: block;">
                <div class="study_list plr15">
                </div>
            </div>
            <div class="relevant_list">
                <div class="history_list plr15">
                </div>
            </div>
            <div class="relevant_list">
                <div class="course_list plr15">
                </div>
            </div>
        </div>
        <!--  -->
        <div class="weui-loadmore loadMore">
            <i class="weui-loading"></i>
            <span class="weui-loadmore__tips">正在加载</span>
        </div>
        <div class="weui-loadmore weui-loadmore_line noMore hide">
            <span class="weui-loadmore__tips">没有更多数据了</span>
        </div>
    </div>
    <script src="https://g.alicdn.com/de/prismplayer/2.9.3/aliplayer-h5-min.js"></script>
    <script src="js/jquery-3.6.0.min.js"></script>
    <script src="js/jquery-weui.min.js"></script>
    <script src="js/md5.js"></script>
    <script src="js/public.js"></script>
    <script>
        var page = 0
        var pages = 0
        var pagess = 0

        // 默认
        var init = getQueryString('init') || 0
        if (init) {
            status = init
            $(".tabs_item").eq(init).trigger('click')
        }

        if (init == 0) {
            getStudy()
        } else if (init == 1) {
            getHistory()
        } else if (init == 2) {
            getOrder()
        }

        // 学习列表
        function getStudy(type) {
            if (type) {
                loading = false
            }
            $(".loadMore").removeClass('hide')

            gethttp('/lt/course_learn?type=c:learn_debug', {
                hasToken: true,
                data: {
                    user: getCookie('userId'),
                    index: page * 10,
                    count: 10
                },
                success: function (res) {
                    let list = res.data.list
                    if (page == 0 && list.length <= 0) {
                        $('.noMore').removeClass('hide')
                        $('.loadMore').addClass('hide')
                        loading = false
                        return false
                    }
                    let arr = ''
                    list.forEach((item, index) => {
                        arr += `<div class="study_item">
                                    <a href="./ot-classroom-play.html?doctor=${item.course.doctor}&courseId=${item.course.id}&fixed=${item.lesson.id}">
                                        <div class="item_time">有效期至${item.order.toUi}</div>
                                        <div class="item_cont">
                                            <div class="item_left">
                                                <div class="item_p1">共 ${item.course.serieCount} 节</div>
                                                <img class="item_img" src="${item.course.coverUrlUi}" alt="">
                                                <div class="item_speed">
                                                    <div style="width: ${Number(item.course.playedPercent) * 100}%;"></div>
                                                </div>
                                            </div>
                                            <div class="item_right">
                                                <div class="item_p2 text-cut-two">${item.course.doctorName}专家 ${item.course.depart2Name}系列 ${item.course.name}</div>
                                                <div class="item_info">
                                                    <div class="item_p3">
                                                        <p class="text-cut-one">${item.course.name}</p>
                                                        <p>已观看到${Number(item.learn.playedPercent) * 100}%</p>    
                                                    </div>
                                                    <div class="item_btn">开始听课</div>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </div>`
                    });
                    page == 0 ? $('.study_list').html(arr) : $('.study_list').append(arr)
                    if (list.length < 10) {
                        $(".noMore").removeClass('hide')
                        loading = true;
                    } else {
                        loading = false;
                    }
                    $(".loadMore").addClass('hide')
                }
            })
        }

        // 浏览记录
        function getHistory(type) {
            if (type) {
                loading = false
            }
            $(".loadMore").removeClass('hide')

            gethttp('/lt/course_learn?type=c:browse', {
                hasToken: true,
                data: {
                    user: getCookie('userId'),
                    index: pages * 10,
                    count: 10
                },
                success: function (res) {
                    let list = res.data.list
                    if (pages == 0 && list.length <= 0) {
                        $('.noMore').removeClass('hide')
                        $('.loadMore').addClass('hide')
                        loading = false
                        return false
                    }
                    let arr = ''
                    list.forEach((item, index) => {
                        arr += `<div class="study_item">
                                <a href="./ot-classroom-play.html?doctor=${item.course.doctor}&courseId=${item.course.id}&fixed=${item.lesson.id}">
                                    <div class="item_cont">
                                        <div class="item_left">
                                            <div class="item_p1">共 ${item.course.serieCount} 节</div>
                                            <img class="item_img" src="${item.course.coverUrlUi}" alt="">
                                            <div class="item_speed">
                                                <div style="width: ${Number(item.learn.playedPercent) * 100}%;"></div>
                                            </div>
                                        </div>
                                        <div class="item_right">
                                            <div class="item_p2 text-cut-two">${item.course.doctorName}专家 ${item.course.depart2Name}系列 ${item.course.name}</div>
                                            <div class="item_info">
                                                <div class="item_p3">
                                                    <p class="text-cut-one">${item.lesson.name}</p>
                                                    <p>已观看到${Number(item.learn.playedPercent) * 100}%</p>
                                                </div>
                                                <div class="item_btn">开始听课</div> 
                                            </div>
                                        </div>
                                    </div>
                                </a>
                            </div>`
                    });
                    pages == 0 ? $('.history_list').html(arr) : $('.history_list').append(arr)
                    if (list.length < 10) {
                        $(".noMore").removeClass('hide')
                        loading = true;
                    } else {
                        loading = false;
                    }
                    $(".loadMore").addClass('hide')
                }
            })
        }

        // 课程订单
        function getOrder(type) {
            if (type) {
                loading = false
            }
            $(".loadMore").removeClass('hide')

            gethttp('/lt/order?type=c:with_course', {
                hasToken: true,
                data: {
                    user: getCookie('userId'),
                    index: pagess * 10,
                    count: 10
                },
                success: function (res) {
                    let list = res.data.list
                    if (pagess == 0 && list.length <= 0) {
                        $('.noMore').removeClass('hide')
                        $('.loadMore').addClass('hide')
                        loading = false
                        return false
                    }
                    let arr = ''
                    list.forEach((item, index) => {
                        arr += `<div class="study_item">
                                <a href="./ot-classroom-play.html?doctor=${item.course.doctor}&courseId=${item.order.course}">
                                    <div class="item_time"> 购买日期：${item.order.payAtUi} <p>已支付 <span>${item.order.price}</span> 元</p>
                                    </div>
                                    <div class="item_cont">
                                        <div class="item_left">
                                            <div class="item_p1">共 ${item.course.serieCount} 节</div>
                                            <img class="item_img" src="${item.course.coverUrlUi}" alt="">
                                            <div class="item_speed hide">
                                                <div style="width: 20%;"></div>
                                            </div>
                                        </div>
                                        <div class="item_right">
                                            <div class="item_p2 text-cut-two">${item.course.doctorName}专家 ${item.course.depart2Name} ${item.course.name}</div>
                                            <div class="item_info">
                                                <div class="item_p3"></div>
                                                <div class="item_btn">开始听课</div>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                            </div>`
                    });
                    pagess == 0 ? $('.course_list').html(arr) : $('.course_list').append(arr)
                    if (list.length < 10) {
                        $(".noMore").removeClass('hide')
                        loading = true;
                    } else {
                        loading = false;
                    }
                    $(".loadMore").addClass('hide')
                }
            })
        }

        // 初始化加载更多
        var loading = false
        $(document.body).infinite().on("infinite", function () {
            if (loading) return;
            loading = true;
            if (status == 0) {
                page = Number(page) + 1
                getStudy()
            } else if (status == 1) {
                pages = Number(pages) + 1
                getHistory()
            } else if (status == 2) {
                pagess = Number(pagess) + 1
                getOrder()
            }
        });

    </script>
</body>

</html>